<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style type="text/css">
        /*
            去掉无序列表中的项目符号，也就是去掉前面的实心点

            项目中如何需要设置项目符号，则可以采用为li设置背景图片的方式来设置
        */
        ul{
            list-style: none;/*列表风格设置为none即可*/
        }
    </style>
</head>
<body>
    <!--
        在HTML中创建列表，一共有三种列表：
            无序列表
            有序列表
            定义列表
    -->

    <!--
        无序列表：
            使用ul标签来创建一个无序列表
            使用li来创建一个一个的列表项

            ul和li都是块元素
    -->
    <ul>
        <li>孙悟空</li>
        <li>猪八戒</li>
        <li>沙悟净</li>
    </ul>

    <!--
        有序列表和无序列表类似，只不过它使用ol来代替了ul，使用有序序号作为项目符号
        ol也是一个块元素
    -->
    <ol>
        <li>孙悟空</li>
        <li>猪八戒</li>
        <li>沙悟净</li>
    </ol>

    <!--
        定义列表：
            定义列表用来对一些词汇内容进行定义的。
            使用dl来创建一组定义列表
            dl中有两个标签：
                dt：被定义的内容
                dd: 对定义内容的描述
    -->
    <dl>
       <dt>宋江</dt>
        <dd>山东及时雨，郓城呼保义，孝义黑三郎</dd>
        <dd>梁山泊上坐首把交椅，天魁星-宋江</dd>
        <dt>武松</dt>
        <dd>景阳冈打虎英雄</dd>
        <dd>打死西门庆后上梁山，人称行者武松</dd>
    </dl>

    <!--
           列表之间都是可以互相嵌套的，可以在无序列表中放一个有序列表，也可以在有序列表中放一个无序列表，有序列表嵌套有序列表，无序列表嵌套无序列表同样也是可以的

           定义列表也可以和无序有序列表嵌套
       -->

</body>
</html>